<template>
  <view>
     <view class="top">
       <view class="search">
         <view class="main" @click="turnSearch">
           <u-icon name="search" size="23" label="搜索"></u-icon>
           <view class="text" >搜索</view>
         </view>
         <u-icon name="scan" size="23"></u-icon>
       </view>
       <view class="msg">
         <u-icon name="chat-fill" size="23"></u-icon>
       </view>
     </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        
      };
    },
    methods:{
      turnSearch(e) {
        uni.navigateTo({
          url:'/pages/search/search'
        })
      }
    }
  }
</script>

<style lang="scss">
 
    .status_bar {
        height: $status-bar-height;
        width: 100%;
    }
      
    .top {
      width: 100%;
      height: 120rpx;
      display: flex;
      align-items: center;
      justify-content: space-between;
      .search {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 630rpx;
        height: 58rpx;
        padding: 0 20rpx;
        background-color: rgb(240, 241, 243 );
        border-radius: 30rpx;
        box-sizing: border-box;
        .main {
          flex: 1;
          display: flex;
          align-items: center;
          .text{
            margin-left: 10rpx;
            font-size: 28rpx;
            color: #848e94;
          }
        }
      }
    }
</style>
